﻿<!DOCTYPE html>
<html>
  <head>
    <title>动态图表控件 Axhub Charts</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=1440, user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <link href="resources/css/jquery-ui-themes.css" type="text/css" rel="stylesheet"/>
    <link href="resources/css/axure_rp_page.css" type="text/css" rel="stylesheet"/>
    <link href="data/styles.css" type="text/css" rel="stylesheet"/>
    <link href="files/_______axhub_charts/styles.css" type="text/css" rel="stylesheet"/>
    <link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" type="text/css" rel="stylesheet"/>
    <script src="resources/scripts/jquery-1.7.1.min.js"></script>
    <script src="resources/scripts/jquery-ui-1.8.10.custom.min.js"></script>
    <script src="resources/scripts/prototypePre.js"></script>
    <script src="data/document.js"></script>
    <script src="resources/scripts/prototypePost.js"></script>
    <script src="files/_______axhub_charts/data.js"></script>
    <script type="text/javascript">
      $axure.utils.getTransparentGifPath = function() { return 'resources/images/transparent.gif'; };
      $axure.utils.getOtherPath = function() { return 'resources/Other.html'; };
      $axure.utils.getReloadPath = function() { return 'resources/reload.html'; };
    </script>
  </head>
  <body>
    <div id="base" class="">

      <!-- Unnamed (元件标题) -->

      <!-- 背景 (Dynamic Panel) -->
      <div id="u4218" class="ax_default" data-label="背景">
        <div id="u4218_state0" class="panel_state" data-label="State1" style="">
          <div id="u4218_state0_content" class="panel_state_content">
          </div>
        </div>
      </div>

      <!-- 线条 (Dynamic Panel) -->
      <div id="u4219" class="ax_default" data-label="线条">
        <div id="u4219_state0" class="panel_state" data-label="State1" style="">
          <div id="u4219_state0_content" class="panel_state_content">
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4220" class="ax_default _默认样式">
        <div id="u4220_div" class=""></div>
        <div id="u4220_text" class="text ">
          <p><span style="font-family:'FontAwesome Bold', 'FontAwesome Regular', 'FontAwesome';"></span><span style="font-family:'微软雅黑 Bold', '微软雅黑';"> 元件标题</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4221" class="ax_default _默认样式">
        <div id="u4221_div" class=""></div>
        <div id="u4221_text" class="text ">
          <p><span style="font-family:'FontAwesome';font-weight:400;"></span><span style="font-family:'微软雅黑';font-weight:400;"> </span><span style="font-family:'FontAwesome';font-weight:400;">作品首页</span></p>
        </div>
      </div>

      <!-- Unnamed (版权信息) -->

      <!-- Unnamed (Rectangle) -->
      <div id="u4223" class="ax_default _默认样式">
        <img id="u4223_img" class="img " src="images/___icons/u605.png"/>
        <div id="u4223_text" class="text ">
          <p><span>Copyright © </span><a id="u4224" class="link"><span>http://t.cn/EPh287q</span></a><span>, All Rights Reserved.</span></p><p><span>打造高保真原型，快人一步</span></p>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u4225" class="ax_default" data-left="20" data-top="100" data-width="1100" data-height="110">

        <!-- Unnamed (Rectangle) -->
        <div id="u4226" class="ax_default _默认样式">
          <div id="u4226_div" class=""></div>
          <div id="u4226_text" class="text ">
            <p style="font-size:14px;"><span style="font-family:'微软雅黑 Bold', '微软雅黑';font-weight:700;">使用说明</span></p><p style="font-size:12px;"><span style="font-family:'微软雅黑';font-weight:400;">Axhub Charts是一套基于Antv，Echarts实现的动态的图表展示解决方案，提供了 折线图、柱状图、条形图、饼图、环形图、面积图等各类常用的图表元件。使用这套图表元件需要对Axure中继器的使用有基本的掌握，详细的使用方法请访问：</span><a id="u4227" class="link"><span style="font-family:'微软雅黑';font-weight:400;">https://axhub.im/charts/</span></a><span style="font-family:'微软雅黑';font-weight:400;">&nbsp; 特别感谢Axhub提供的分享和支持。扩展阅读文章：</span><a id="u4228" class="link"><span style="font-family:'微软雅黑';font-weight:400;">图表设计，远不止“好看”这么简单</span></a></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u4229" class="ax_default _默认样式">
          <div id="u4229_div" class=""></div>
          <div id="u4229_text" class="text ">
            <p><span></span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4230" class="ax_default _默认样式">
        <div id="u4230_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4231" class="ax_default _默认样式">
        <div id="u4231_div" class=""></div>
        <div id="u4231_text" class="text ">
          <p><span>折线图 Line Chart</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4232" class="ax_default _默认样式">
        <div id="u4232_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4233" class="ax_default _默认样式">
        <div id="u4233_div" class=""></div>
        <div id="u4233_text" class="text ">
          <p><span>柱状图 Column Chart</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4234" class="ax_default _默认样式">
        <div id="u4234_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4235" class="ax_default _默认样式">
        <div id="u4235_div" class=""></div>
        <div id="u4235_text" class="text ">
          <p><span>条形图 Bar Chart</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4236" class="ax_default _默认样式">
        <div id="u4236_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4237" class="ax_default _默认样式">
        <div id="u4237_div" class=""></div>
        <div id="u4237_text" class="text ">
          <p><span>饼图 Pie Chart</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4238" class="ax_default _默认样式">
        <div id="u4238_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4239" class="ax_default _默认样式">
        <div id="u4239_div" class=""></div>
        <div id="u4239_text" class="text ">
          <p><span>环形图 Donut Chart</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4240" class="ax_default _默认样式">
        <div id="u4240_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4241" class="ax_default _默认样式">
        <div id="u4241_div" class=""></div>
        <div id="u4241_text" class="text ">
          <p><span>面积图 Area Chart</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4242" class="ax_default _默认样式">
        <div id="u4242_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4243" class="ax_default _默认样式">
        <div id="u4243_div" class=""></div>
        <div id="u4243_text" class="text ">
          <p><span>甘特图 Gantt Chart</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4244" class="ax_default _默认样式">
        <div id="u4244_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4245" class="ax_default _默认样式">
        <div id="u4245_div" class=""></div>
        <div id="u4245_text" class="text ">
          <p><span>漏斗图 Funnel Chart</span></p>
        </div>
      </div>

      <!-- Gantt (Group) -->
      <div id="u4246" class="ax_default" data-label="Gantt" data-left="40" data-top="1529" data-width="500" data-height="300">

        <!-- axhub-gantt-config (Repeater) -->
        <div id="u4247" class="ax_default" data-label="axhub-gantt-config">
          <script id="u4247_script" type="axure-repeater-template" data-label="axhub-gantt-config">
          </script>
          <div id="u4247-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4247-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4247-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4247-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-gantt-data (Repeater) -->
        <div id="u4248" class="ax_default" data-label="axhub-gantt-data">
          <script id="u4248_script" type="axure-repeater-template" data-label="axhub-gantt-data">
          </script>
          <div id="u4248-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4248-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4248-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4248-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4248-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4248-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-gantt-chart (Rectangle) -->
        <div id="u4249" class="ax_default _默认样式" data-label="axhub-gantt-chart">
          <img id="u4249_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4249_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">甘特图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- stacked (Group) -->
      <div id="u4250" class="ax_default" data-label="stacked" data-left="600" data-top="1529" data-width="500" data-height="300">

        <!-- axhub-funnel-config (Repeater) -->
        <div id="u4251" class="ax_default" data-label="axhub-funnel-config">
          <script id="u4251_script" type="axure-repeater-template" data-label="axhub-funnel-config">
          </script>
          <div id="u4251-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4251-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4251-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4251-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4251-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4251-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-funnel-data (Repeater) -->
        <div id="u4252" class="ax_default" data-label="axhub-funnel-data">
          <script id="u4252_script" type="axure-repeater-template" data-label="axhub-funnel-data">
          </script>
          <div id="u4252-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4252-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4252-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4252-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4252-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-funnel-chart (Rectangle) -->
        <div id="u4253" class="ax_default _默认样式" data-label="axhub-funnel-chart">
          <img id="u4253_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4253_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">漏斗图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- Line (Group) -->
      <div id="u4254" class="ax_default" data-label="Line" data-left="40" data-top="300" data-width="500" data-height="300">

        <!-- axhub-line-config (Repeater) -->
        <div id="u4255" class="ax_default" data-label="axhub-line-config">
          <script id="u4255_script" type="axure-repeater-template" data-label="axhub-line-config">
          </script>
          <div id="u4255-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4255-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4255-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4255-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4255-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4255-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4255-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4255-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-line-data (Repeater) -->
        <div id="u4256" class="ax_default" data-label="axhub-line-data">
          <script id="u4256_script" type="axure-repeater-template" data-label="axhub-line-data">
          </script>
          <div id="u4256-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-9" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-10" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-11" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4256-12" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-line-chart (Rectangle) -->
        <div id="u4257" class="ax_default _默认样式" data-label="axhub-line-chart">
          <img id="u4257_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4257_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">折线图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- Colum (Group) -->
      <div id="u4258" class="ax_default" data-label="Colum" data-left="600" data-top="300" data-width="500" data-height="300">

        <!-- axhub-column-config (Repeater) -->
        <div id="u4259" class="ax_default" data-label="axhub-column-config">
          <script id="u4259_script" type="axure-repeater-template" data-label="axhub-column-config">
          </script>
          <div id="u4259-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4259-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4259-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4259-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4259-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4259-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4259-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-column-data (Repeater) -->
        <div id="u4260" class="ax_default" data-label="axhub-column-data">
          <script id="u4260_script" type="axure-repeater-template" data-label="axhub-column-data">
          </script>
          <div id="u4260-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-9" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-10" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-11" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4260-12" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-column-chart (Rectangle) -->
        <div id="u4261" class="ax_default _默认样式" data-label="axhub-column-chart">
          <img id="u4261_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4261_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">柱状图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- GroupedBar (Group) -->
      <div id="u4262" class="ax_default" data-label="GroupedBar" data-left="40" data-top="711" data-width="500" data-height="300">

        <!-- axhub-groupedBar-config (Repeater) -->
        <div id="u4263" class="ax_default" data-label="axhub-groupedBar-config">
          <script id="u4263_script" type="axure-repeater-template" data-label="axhub-groupedBar-config">
          </script>
          <div id="u4263-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4263-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4263-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4263-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4263-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4263-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4263-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4263-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-groupedBar-data (Repeater) -->
        <div id="u4264" class="ax_default" data-label="axhub-groupedBar-data">
          <script id="u4264_script" type="axure-repeater-template" data-label="axhub-groupedBar-data">
          </script>
          <div id="u4264-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-9" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-10" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-11" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4264-12" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-groupedBar-chart (Rectangle) -->
        <div id="u4265" class="ax_default _默认样式" data-label="axhub-groupedBar-chart">
          <img id="u4265_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4265_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">条形图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- Pie (Group) -->
      <div id="u4266" class="ax_default" data-label="Pie" data-left="600" data-top="711" data-width="500" data-height="300">

        <!-- axhub-pie-config (Repeater) -->
        <div id="u4267" class="ax_default _默认样式" data-label="axhub-pie-config">
          <script id="u4267_script" type="axure-repeater-template" data-label="axhub-pie-config">
          </script>
          <div id="u4267-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4267-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4267-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4267-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4267-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-pie-data (Repeater) -->
        <div id="u4268" class="ax_default _默认样式" data-label="axhub-pie-data">
          <script id="u4268_script" type="axure-repeater-template" data-label="axhub-pie-data">
          </script>
          <div id="u4268-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4268-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4268-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4268-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4268-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-pie-chart (Rectangle) -->
        <div id="u4269" class="ax_default _默认样式" data-label="axhub-pie-chart">
          <img id="u4269_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4269_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">饼图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- Donut (Group) -->
      <div id="u4270" class="ax_default" data-label="Donut" data-left="40" data-top="1120" data-width="500" data-height="300">

        <!-- axhub-donut-config (Repeater) -->
        <div id="u4271" class="ax_default" data-label="axhub-donut-config">
          <script id="u4271_script" type="axure-repeater-template" data-label="axhub-donut-config">
          </script>
          <div id="u4271-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4271-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4271-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4271-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4271-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-donut-data (Repeater) -->
        <div id="u4272" class="ax_default" data-label="axhub-donut-data">
          <script id="u4272_script" type="axure-repeater-template" data-label="axhub-donut-data">
          </script>
          <div id="u4272-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4272-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4272-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4272-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4272-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-donut-chart (Rectangle) -->
        <div id="u4273" class="ax_default _默认样式" data-label="axhub-donut-chart">
          <img id="u4273_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4273_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">环形图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- stacked (Group) -->
      <div id="u4274" class="ax_default" data-label="stacked" data-left="600" data-top="1120" data-width="500" data-height="300">

        <!-- axhub-stacked-config (Repeater) -->
        <div id="u4275" class="ax_default _默认样式" data-label="axhub-stacked-config">
          <script id="u4275_script" type="axure-repeater-template" data-label="axhub-stacked-config">
          </script>
          <div id="u4275-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4275-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4275-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4275-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4275-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4275-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4275-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4275-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-stacked-data (Repeater) -->
        <div id="u4276" class="ax_default _默认样式" data-label="axhub-stacked-data">
          <script id="u4276_script" type="axure-repeater-template" data-label="axhub-stacked-data">
          </script>
          <div id="u4276-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-9" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-10" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-11" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4276-12" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-stacked-chart (Rectangle) -->
        <div id="u4277" class="ax_default _默认样式" data-label="axhub-stacked-chart">
          <img id="u4277_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4277_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">面积图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4278" class="ax_default _默认样式">
        <div id="u4278_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4279" class="ax_default _默认样式">
        <div id="u4279_div" class=""></div>
        <div id="u4279_text" class="text ">
          <p><span>堆叠柱状图 Stacked Column Chart</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4280" class="ax_default _默认样式">
        <div id="u4280_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4281" class="ax_default _默认样式">
        <div id="u4281_div" class=""></div>
        <div id="u4281_text" class="text ">
          <p><span>堆叠条形图 Stacked Bar Chart</span></p>
        </div>
      </div>

      <!-- StackedColumn (Group) -->
      <div id="u4282" class="ax_default" data-label="StackedColumn" data-left="40" data-top="1939" data-width="500" data-height="300">

        <!-- axhub-stackedColumn-config (Repeater) -->
        <div id="u4283" class="ax_default _默认样式" data-label="axhub-stackedColumn-config">
          <script id="u4283_script" type="axure-repeater-template" data-label="axhub-stackedColumn-config">
          </script>
          <div id="u4283-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4283-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4283-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4283-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4283-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4283-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-stackedColumn-data (Repeater) -->
        <div id="u4284" class="ax_default _默认样式" data-label="axhub-stackedColumn-data">
          <script id="u4284_script" type="axure-repeater-template" data-label="axhub-stackedColumn-data">
          </script>
          <div id="u4284-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-9" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-10" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-11" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4284-12" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-stackedColumn-chart (Rectangle) -->
        <div id="u4285" class="ax_default _默认样式" data-label="axhub-stackedColumn-chart">
          <img id="u4285_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4285_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">堆叠柱状图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- StackedBar (Group) -->
      <div id="u4286" class="ax_default" data-label="StackedBar" data-left="600" data-top="1939" data-width="500" data-height="300">

        <!-- axhub-stackedBar-config (Repeater) -->
        <div id="u4287" class="ax_default _默认样式" data-label="axhub-stackedBar-config">
          <script id="u4287_script" type="axure-repeater-template" data-label="axhub-stackedBar-config">
          </script>
          <div id="u4287-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4287-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4287-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4287-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4287-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4287-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4287-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4287-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-stackedBar-data (Repeater) -->
        <div id="u4288" class="ax_default _默认样式" data-label="axhub-stackedBar-data">
          <script id="u4288_script" type="axure-repeater-template" data-label="axhub-stackedBar-data">
          </script>
          <div id="u4288-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-9" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-10" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-11" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4288-12" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-stackedBar-chart (Rectangle) -->
        <div id="u4289" class="ax_default _默认样式" data-label="axhub-stackedBar-chart">
          <img id="u4289_img" class="img " src="images/_______axhub_charts/axhub-gantt-chart_u4249.png"/>
          <div id="u4289_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">堆叠条形图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4290" class="ax_default _默认样式">
        <div id="u4290_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u4291" class="ax_default _默认样式">
        <div id="u4291_div" class=""></div>
        <div id="u4291_text" class="text ">
          <p><span>散点图 Scatter Chart</span></p>
        </div>
      </div>

      <!-- Line (Group) -->
      <div id="u4292" class="ax_default" data-label="Line" data-left="40" data-top="2350" data-width="1060" data-height="300">

        <!-- axhub-scatter-config (Repeater) -->
        <div id="u4293" class="ax_default _默认样式" data-label="axhub-scatter-config">
          <script id="u4293_script" type="axure-repeater-template" data-label="axhub-scatter-config">
          </script>
          <div id="u4293-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4293-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4293-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4293-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4293-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4293-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4293-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-scatter-data (Repeater) -->
        <div id="u4294" class="ax_default _默认样式" data-label="axhub-scatter-data">
          <script id="u4294_script" type="axure-repeater-template" data-label="axhub-scatter-data">
          </script>
          <div id="u4294-1" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-2" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-3" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-4" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-5" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-6" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-7" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-8" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-9" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-10" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-11" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-12" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-13" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-14" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-15" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-16" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-17" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-18" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-19" class="preeval" style="width: 0px; height: 0px;">
          </div>
          <div id="u4294-20" class="preeval" style="width: 0px; height: 0px;">
          </div>
        </div>

        <!-- axhub-scatter-chart (Rectangle) -->
        <div id="u4295" class="ax_default _默认样式" data-label="axhub-scatter-chart">
          <img id="u4295_img" class="img " src="images/_______axhub_charts/axhub-scatter-chart_u4295.png"/>
          <div id="u4295_text" class="text ">
            <p style="font-size:16px;line-height:36px;"><span style="color:#333333;">Axhub Charts</span></p><p style="font-size:36px;line-height:48px;"><span style="color:#333333;">散点图</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">通过Group内data和config中继器可更改数据及配置</span></p><p style="font-size:14px;line-height:21px;"><span style="color:#CCCCCC;">详情访问：https://axhub.im/charts</span></p>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>
